<template>
  <cube-page type="scroll-view" title="高毛利回复" @rightBtnClick="zfilterDrawer" :rightBtnTxt="true">
    <div slot="content">
      <div class="zuipagesubWrap">
        <div class="zrow">
          <div class="zlabel">物料：</div>
          <div class="zdes zpicker" @click="searchWuliao">
            <div v-if="w_shortageData">{{w_shortageData.code}}</div>
            <div v-else style="color: gray;">请选择物料</div>
            <i class="cubeic-arrow"></i>
          </div>
        </div>
        <div class="zrow ztips">
          <div class="zlabel">规格：</div>
          <div class="zdes">
            <div v-if="w_shortageData">{{w_shortageData.specifications}}</div>
          </div>
        </div>
        <div class="zrow ztips">
          <div class="zlabel">产地：</div>
          <div class="zdes">
            <div v-if="w_shortageData">{{w_shortageData.place}}</div>
          </div>
        </div>
        <div class="zrow">
          <div class="zlabel">医院：</div>
          <div class="zdes zpicker" @click="searchHosp">
            <div v-if="w_hospital">{{w_hospital.label}}</div>
            <div v-else style="color: gray;">请选择医院</div>
            <i class="cubeic-arrow"></i>
          </div>
        </div>
        <div class="zrow">
          <div class="zlabel">数量：</div>
          <div class="zdes">
            <cube-input class="zinput" type="number" v-model="num" placeholder="请输入需求数量" v-clearNoNum></cube-input>
          </div>
        </div>
        <div class="zrow">
          <div class="zlabel">时间：</div>
          <div class="zdes zpicker" @click="showDatePicker">
            <div v-if="date">{{date}}</div>
            <div v-else style="color: gray;">请选择预计开票时间</div>
            <i class="cubeic-arrow"></i>
          </div>
        </div>
        <div class="zui-flex btn-area">
          <cube-button class="zbtn J_reset" @click="reset">重置</cube-button>
          <cube-button class="zbtn J_sub" @click="subpage">提交</cube-button>
        </div>
      </div>

      <cube-view></cube-view>
    </div>
  </cube-page>
</template>

<script>
import {
  mapState,
  mapGetters,
  mapMutations,
  mapActions
} from 'vuex'

import CubePage from '@/components/cube-page'
import CubeView from '@/components/cube-view'
import {zprofitfeedbacksub} from '@/util/api';

export default {
  name: 'Feedback',
  components: {
    CubePage,
    CubeView
  },
  computed: {
    ...mapState(['loginUserInfo', 'w_shortageData', 'w_hospital']),
  },
  data () {
    return {
      num: '',
      date: '',
      datePicker: null
    }
  },
  created () {
    
  },
  mounted() {
    
  },
  watch: {
    
  },
  methods: {
    ...mapMutations(['setLoginUserInfo', 'setW_shortageData', 'setW_hospital']),
    searchWuliao () {
      this.$router.push("/profit/feedbackp/wuliaop");
    },
    searchHosp () {
      this.$router.push("/profit/feedbackp/hospitalp");
    },
    zfilterDrawer () {
      this.$router.push("/profit/feedbackp/feedbackplist");
    },
    reset () {
      this.setW_shortageData(null);
      this.setW_hospital(null);
      this.num = '';
    },
    subpage () {
      if(!this.w_shortageData){
        this.$createToast({
          txt: '请选择物料',
          type: 'warn'
        }).show();
        return false;
      }
      if(!this.w_hospital){
        this.$createToast({
          txt: '请选择医院',
          type: 'warn'
        }).show();
        return false;
      }
      if(!this.num){
        this.$createToast({
          txt: '请输入需求数量',
          type: 'warn'
        }).show();
        return false;
      }
      if(!this.date){
        this.$createToast({
          txt: '请输入预计开票时间',
          type: 'warn'
        }).show();
        return false;
      }
      this.subpageS();
    },
    async subpageS () {
      const zuiCubeLoading = this.$createToast({time: 0,txt: '正在加载中...'});
      zuiCubeLoading.show();
      let tbl_param = {
        code: this.w_shortageData.code,
        hospital: this.w_hospital.value,
        num: this.num,
        date: this.date,
        returntype:2
      }
      let res = await zprofitfeedbacksub(tbl_param);
      res = this.zutil.formatAxiosData(res);
      zuiCubeLoading.hide();
      if(res.code == '0000'){
        this.$createToast({
          txt: '提交反馈成功',
          type: 'correct'
        }).show();

        this.reset();
      }else{
        this.$createToast({
          txt: res.message || "提交反馈失败！",
          type: 'error'
        }).show();
      }
    },
    showDatePicker () {
      if (!this.datePicker) {
        this.datePicker = this.$createDatePicker({
          min: new Date(1949, 0, 1),
          max: new Date(),
          value: new Date(),
          onSelect: (date, selectedVal, selectedText) => {
            this.date = this.moment(date).format('YYYY-MM-DD');
          }
        })
      }
      this.datePicker.show();
    }
  }
}
</script>

<style scoped lang="scss">

.scroll-list-wrap {
  
}

</style>
